body{
    background-image: url("../image/background-img.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
/* 描述 博客详情页的样式 */

/* 博文样式 */
.blog {
    padding: 10px;

}

/* 标题样式 */
.blog .title {
    text-align: center;
    margin: 5px;
}


/* 日期样式 */
.blog .date {

    text-align: center;
    color: rgb(1, 167, 72);
}

.desc{
    display: flex;
    justify-content: center;
    align-items: center;


}
/*展示文章数据 样式*/
.blog .rcount, .likedcount, .commentcount, .collectcount{

    text-align: center;
    color: rgba(32, 33, 37, 0.7);
}

/* 给每个段落 设置格式 */
#content {
    /* 首行缩进2字 外间距 */
    text-indent: 2em;
    margin: 15px;
    width: 740px;
    background-color: black;
    word-wrap: break-word; /* 设置自动换行 */

    /* 解决 符号溢出自动换行时 格式错误的情况*/
    line-break: anywhere;
}

.option {
    height: 60px;
    width: 170px;
    margin-left: 275px;
    /*margin-left: 30px;*/
    margin-top: 10px;
}
/* 点赞格式  收藏*/
.like,.collect{
    /*margin-left: 40px;*/
    /*padding: 10px;*/
    width: 80px;
    height: 45px;
    border-radius: 5px;
    /* /鼠标悬停 */
    transition: all 1s;
}

.like:hover,.collect:hover {
    background-color: rgba(255, 205, 67,0.8);
}
.del, .mod {
    padding: 10px;
}

.comments{
    box-sizing: border-box;
    background-color: rgba(219,221,225);
    /*padding-right: 10px;*/
    height: calc(100% - 370px);
    width: 445px;
    overflow: auto;
    border-radius: 5px;
}
.comment{
    display: inline-block;
    box-sizing: border-box;
    width: 423px;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-top: 2px;
    margin-left: 2px;
    padding-left: 3px;
    background-color: #ced4da;
    font-family: '楷体';

    word-wrap: break-word; /* 设置自动换行 */

    /* 解决 符号溢出自动换行时 格式错误的情况*/
    line-break: anywhere;
    /*border-style:solid ;*/
    /*border-color:grey ;*/
    /*word-break:break-all;*/
    /*word-wrap: break-word;*/
}
.comments .del{
    /*display: inline-block;*/
    width: 423px;
    height: 40px;
}
.mes{
    display: inline-block;

    width: 390px;
    height: 30px;
    border-radius: 5px;
    margin-top: 2px;
    padding-left: 2px;
    background-color: #ced4da;
    font-family: '楷体';

}

.send{
    margin-left: -2px;
    width: 50px;
    height: 30px;
    border-radius: 5px;
    cursor: pointer;
}
.send:active{
    background-color: yellow;

}

.message {
    padding: 10px;
    margin: 50px;
    border: 2px black dashed;
}